<template>
    <div class="useritem">
        <div class="top">
            <div class="userMessage">
                我的消息
            </div>
            <div class="pointsShopping">
                积分商城
            </div>
            <div class="vipCard">
                会员卡
            </div>
        </div>
        <div class="bottom">
            <div class="userCart" v-on:click="goCart">
                我的购物车
            </div>
            <div class="getApp">
                下载购物APP
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "UserItem",
    methods:{
        goCart(){
            this.$router.push('/cart')
        }
    }
}
</script>

<style scoped>
.useritem{
    font-size: 14px;
}
.top div,.bottom div{
    height: 40px;
    line-height: 40px;
    padding-left: 50px;
}
.top,.bottom{
    border-top: 13px solid rgba(100,100,100,.1);
}
.userMessage{
    background: url("~assets/img/profile/message.svg") no-repeat  20px 10px;
    background-size:20px 20px;
}
.pointsShopping{
    background: url("~assets/img/profile/pointer.svg") no-repeat 20px 10px;
    background-size:20px 20px;
}
.vipCard{
    background: url("~assets/img/profile/vip.svg") no-repeat 20px 10px;
    background-size:20px 20px;
}
.userCart{
    background: url("~assets/img/profile/cart.svg") no-repeat 18px 5px;
    background-size:25px 25px;
}
.getApp{
    background: url("~assets/img/profile/shopping.svg") no-repeat 20px 10px;
    background-size:20px 20px;
}
</style>
